@charset "utf-8";
/* CSS Document */
/*reset*/
.protal-wrap{font:12px/1.5 Arial,'Microsoft YaHei',\5b8b\4f53;}
.protal-wrap h2,h2,h3,h4{font-size:100%;font-weight: normal;margin:0;padding:0;}
.protal-wrap em{font-style:normal;font-weight:normal;}
.protal-wrap a,.protal-wrap a:hover{text-decoration:none;}
.protal-wrap img{border:0;vertical-align: bottom;}
.protal-wrap p{margin:0;padding:0;}

.protal-wrap .font12{font-size: 12px;}.protal-wrap .font14{font-size: 14px;}.protal-wrap .font16{font-size: 16px;}.font18{font-size: 18px;}
.protal-wrap .font9{color: #999;}
.protal-wrap .center{text-align: center;}
.protal-wrap .mb5{margin-bottom: 5px;}.protal-wrap .mb15{margin-bottom: 15px;}
.protal-wrap .mr10{margin-right: 10px;}.protal-wrap .mr20{margin-right: 20px;}.protal-wrap .mr30{margin-right: 30px;}
.protal-wrap .ml20{margin-left: 20px;}
.protal-wrap .fontblue{ color: #3855a3;}
.clearfix:after{content:'\20';display:block;height:0;clear:both}.clearfix{zoom:1}.fl{float:left}.fr{float:right}

.pro-icons{ background: url(img/pro-icons.png) no-repeat 0 0; background-size: 36px 497px;}
.i-wifi{ background-position: 0 -456px;}
.i-back{background-position: -15px -482px;}

.header{width: 100%; height: 44px; line-height: 44px; background: #4464af; filter:alpha(opacity=90); opacity: .9;color: #fff;}
.header.topfixed{ position: absolute; top: 0; left: 0;z-index: 99;}
.header .i-wifi{position: relative;top: 2px; display: inline-block;margin-right: 5px; width: 18px; height: 13px;}
.header .i-back{position: relative; display: inline-block; left: 10px; width: 15px;height: 15px;}
.header .back-wrap{position: absolute; display: block;top: 0;left: 0; width: 44px;height: 44px;}
.page_scroll{position: absolute;left: 0; bottom: 10px; width: 100%; text-align:center; z-index: 10;}
.page_scroll .page{ display:inline-block; padding:0 4px 2px 4px; height: 14px; line-height: 14px; background: rgba(0,0,0,.1); text-align: center; border-radius:15px;}
.page_scroll .dot{position: relative; display: inline-block; margin-right:8px; width: 6px; height: 6px;  background: #4464af; border-radius: 6px; vertical-align: middle;}
.page_scroll .dot:last-child{margin-right: 0;}
.page_scroll .dot.on{border: 2px solid #4464af; background:none; border-radius: 10px;}

.pro-btn{ display: inline-block; width: 140px; height: 45px; line-height: 45px;text-align: center; font-size: 18px; color: #fff; background: #f17f8f; border-radius: 10px; box-shadow: 0 3px 8px rgba(244,107,117,.5);}
.pro-btn.sm{ width: 120px; height: 40px; line-height: 40px; border-radius: 5px;}
.pro-btn:hover{ background: #f38189;color: #fff;}
.protal-wrap{padding: 10px;}
.preview{position: relative;margin-bottom: 30px; width: 320px; border: 2px solid #3855a3;}
.preview img{width: 100%;}
.pro-menu{padding: 0 5px;}
.pro-menu .imgbox{position: relative; height: 100px;overflow: hidden;border-radius:10px; cursor: pointer;}
.menu-sub .imgbox{width: 153px;}
.pre-txt{display: none;}
.pre-block{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #e6e6e6;text-align: center; color: #fff; font-size: 16px; cursor: pointer;}
.pre-block.on{ background-color: #f38189;}
.pre-block.on .pre-txt{display: inline;}
.pro-banner{position: relative; width: 320px; height: 189px;cursor: pointer;}
.pro-banner .pre-block{line-height: 189px;}
.pro-menu .imgbox .pre-block{ line-height: 100px;}
.leader{width: 320px; height:568px}
.leader .pre-block{line-height: 568px;}
.pre-title{position: absolute; top: 50%; margin-top: -12px; padding: 0 7%; width: 86%;height: 24px; text-align: center; color: #fff;font-size: 16px;overflow: hidden;}

/*inputbox*/
.inputbox{position: relative; display: inline-block;*display:inline;*zoom:1;width: 142px; height: 38px; line-height: 38px; border: 1px solid #ebebeb; border-radius: 5px;overflow: hidden; vertical-align: middle;}
.inputbox span,.inputbox .iptbox{position: absolute;top: 0; display: inline-block;height: 38px; line-height: 38px; text-align: center; background-color: #fff;}
.inputbox .reduce,.inputbox .increase{width: 38px; cursor: pointer;color: #999;}
.inputbox .reduce{left:0;}
.inputbox .increase{right: 0;}
.inputbox input[type="text"]{border: 0;box-shadow: none; border-radius: 0; left: 38px;padding: 0; width: 64px;border-top:0; border-bottom: 0; border-left:1px solid #ebebeb; border-right:1px solid #ebebeb; font-size: 16px;}
.protal-main{padding: 10px; width: 640px;min-height: 520px; _height:520px; border: 1px solid #ebebeb; background: #fff;}
.protal-con .item{padding: 15px 0; border-bottom: 1px solid #ebebeb;}
.protal-con .item:last-child{ border-bottom: 0;}
.addbtn{ display: inline-block;margin-right: 10px; width: 20px; height: 20px; border-radius: 22px; border:1px solid #3855a3; text-align: center; line-height: 20px; color: #3855a3;font-size: 18px;}

.item-ipt{padding:10px 15px; width:340px; height: 24px; border: 1px solid #ebebeb; border-radius: 5px; background: #f2f2f2; font-size: 16px;}
/*.item-ipt.focus{border-color: #3855a3;}*/
.item-img{position: relative; display: block; border: 1px solid #e6e6e6; background: #e6e6e6; text-align: center; color: #fff;}
.item-img .addwrap{position: absolute;top:50%;left: 50%; margin: -12px 0 0 -36px; z-index: 10;cursor: pointer;color: #fff;}
.item-img .addbtn{border-color: #fff; color: #fff;}
.item-img img{width: 100%;}
.item-img:hover{background: #bbb;}
.item-img:hover img{opacity: .5; filter:alpha(opacity=50);}
/*.item-up .addwrap{display: none;}
.item-up:hover .addwrap{display: inline;}*/
.item-rt{width: 430px;}

.i-banner .item-img{ width: 180px; height: 106px;}
.i-menu01 .item-img{ width: 310px; height: 100px;}
.i-menu02 .item-img{ width: 153px; height: 100px;}
.i-leader .item-img{ width: 200px; height: 355px;}

.other-content{margin-top: 20px; padding: 20px; width: 710px; border: 1px solid #ebebeb; background: #fff;}

/*login*/
.center{text-align: center;}
.login-wrap .mb20{margin-bottom: 20px;}
.login-wrap .mb40{margin-bottom: 40px;}
.login-wrap p{padding: 0;margin: 0;}
.login-wrap{position: absolute; top: 50%;left: 50%; margin: -275px 0 0 -200px; width: 400px; height: 550px; background:rgba(255,255,255,.4); border-radius: 10px;}
.login-box{padding: 30px; opacity: 1; color:#3855a3;}
.login-box .tit{font-size: 24px; margin-bottom: 10px; font-family:'Microsoft YaHei';}
.date-box{ width: 120px; margin: 0 auto; padding: 5px 0; border-top: 4px solid #3855a3; color: #3855a3; font-family:'Microsoft YaHei';}
.date-box .d-block{ display: inline-block; margin-left:5px; width: 8px; height: 8px; background: #f38189;}
.login-con{position: relative;padding-top: 30px;}
.login-con .tips{position: absolute; top:5px; left: 0; width: 340px; text-align: center; color: #fc3661;}
.login-con .pro-btn{width: 338px;border-radius: 5px;}
.login-con input.item-ipt{padding:10px 15px; width: 308px; height: 24px; border: 1px solid #ebebeb; border-radius: 5px; background: #f2f2f2; font-size: 16px;}
.login-con input.focus{border-color: #3855a3;}